<template>
  <div class="option">
    <!-- 左侧条件 -->
    <a-button-group class="left">
      <page-help :tab />
      <div class="sep"></div>
      <db-simple-item :disable="type === ''" tip="刷新" @click="executeQuery">
        <refresh-icon />
      </db-simple-item>
      <div class="sep"></div>
      <db-simple-item tip="新增" @click="recordAdd">
        <add-icon />
      </db-simple-item>
      <db-simple-item :disable="selectedKeys.length === 0" tip="删除" @click="recordReduce">
        <minus-icon />
      </db-simple-item>
      <db-simple-item :disable="selectedKeys.length !== 1" tip="更新" @click="recordEdit">
        <edit-icon />
      </db-simple-item>
    </a-button-group>
    <!-- 右侧条件 -->
    <a-button-group class="right">
      <!-- 选择索引 -->
      <db-index-select :tab />
      <!-- 打印 -->
      <db-simple-item :disable="!index" tip="打印" @click="openExportDialog">
        <print-icon />
      </db-simple-item>
      <!-- 索引结构 -->
      <db-simple-item :disable="type !== 'index'" tip="索引结构" @click="openMappingDrawer">
        <frame1-icon />
      </db-simple-item>
      <!-- 跳转到基础查询 -->
      <db-simple-item :disable="type === ''" tip="跳转到 基础查询" @click="jumpToBaseSearchWrapper">
        <search-icon />
      </db-simple-item>
      <!-- 跳转到高级查询 -->
      <db-simple-item
        :disable="type === ''"
        tip="跳转到 高级查询"
        @click="jumpToSeniorSearchWrapper"
      >
        <filter-icon />
      </db-simple-item>
      <!-- 筛选 -->
      <db-table-header :tab />
      <!-- 操作 -->
      <a-dropdown trigger="click">
        <a-button type="text" size="mini">
          <template #icon>
            <icon-more-vertical />
          </template>
        </a-button>
        <template #content>
          <a-doption @click="openHelp()">帮助</a-doption>
        </template>
      </a-dropdown>
    </a-button-group>
  </div>
</template>
<script lang="ts" setup>
import Constant from "@/global/Constant";
import MessageUtil from "@/utils/model/MessageUtil";
import { execAdd, execUpdate } from "@/page/data-browse/component/DbHeader/DbContextmenu";
import DbSimpleItem from "@/page/data-browse/component/DbHeader/components/DbSimpleItem.vue";
import PageHelp from "@/page/data-browse/component/DbHeader/components/PageHelp.vue";
import DbIndexSelect from "@/page/data-browse/component/DbHeader/components/DbIndexSelect.vue";
import DbTableHeader from "@/page/data-browse/component/DbHeader/components/DbTableHeader.vue";
import {
  AddIcon,
  EditIcon,
  FilterIcon,
  Frame1Icon,
  MinusIcon,
  PrintIcon,
  RefreshIcon,
  SearchIcon
} from "tdesign-icons-vue-next";
import { UseDataBrowserInstance } from "@/hooks";

const props = defineProps({
  tab: {
    type: Object as PropType<UseDataBrowserInstance>,
    required: true
  }
});

const { index, type, selectedKeys, total, run, removeBatch, update, add } =
  props.tab as UseDataBrowserInstance;

const recordReduce = () => removeBatch();
const executeQuery = () => run();
const openMappingDrawer = () => {
  // TODO: 打开映射
};
const jumpToBaseSearchWrapper = () => {
  // todo: 跳转到基础搜索
};
const jumpToSeniorSearchWrapper = () => {
  // todo: 跳转到高级搜索
};

function recordEdit(_id?: string) {
  if (!index.value) {
    MessageUtil.error("请选择索引");
    return;
  }
  // TODO: 执行编辑，获取选中的 数据
  execUpdate(index.value, "", "").then(({ id, data }) => update(id, data));
}

function recordAdd() {
  if (!index.value) {
    return;
  }
  execAdd(index.value, props.tab)
    .then((data) => add(data))
    .catch((e) => MessageUtil.error("打开新增失败", e));
}

function openExportDialog() {
  // 选择了索引
  if (!index.value) {
    MessageUtil.error("请选择索引");
    return;
  }
  // 有记录
  if (total.value === 0) {
    MessageUtil.warning("数据为空");
    return;
  }
  // TODO: 显示导出对话框
  // showDataExportDrawer({
  //   name: index.value,
  //   index: index.value,
  //   search: buildSearchQuery()
  // })
}

const openHelp = () => utools.shellOpenExternal(Constant.doc.dataBrowse);
</script>
<style scoped></style>
